<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>Home</title>
    <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
</head>
<body>
    <!-- 搜索栏 -->
    <div class="search-bar">
        <input type="text" placeholder="搜索...（仅供欣赏，功能仍在开发）" />
    </div>

    <!-- 轮播图 -->
    <div class="carousel">
        <div class="carousel-container">
            <img src="{{ url_for('static', filename='photos/中山陵.jpg') }}" alt="轮播图1" class="carousel-image" />
            <img src="{{ url_for('static', filename='photos/纪念碑.jpg') }}" alt="轮播图2" class="carousel-image" />
            <img src="{{ url_for('static', filename='photos/天安门.jpg') }}" alt="轮播图" class="carousel-image" />
        </div>
    </div>

    <div class="action-buttons">
        <a href="{{ url_for('tickets') }}" class="button-item">
            <img src="{{ url_for('static', filename='photos/门票.png') }}" alt="热门景点">
            <p>热门景点</p>
        </a>
        
        <a href="{{ url_for('groups') }}" class="button-item">
            <img src="{{ url_for('static', filename='photos/团票.png') }}" alt="团票预定">
            <p>团票预定</p>
        </a>
    </div>

    <!-- 热门景点区域 -->
    <div class="hotspots">
        <h3>热门景点</h3>
        <div class="hotspot-items">
            <div class="hotspot-item">
                <img src="{{ url_for('static', filename='photos/西湖.jpg') }}" alt="杭州西湖" />
                <p>西湖</p>
            </div>
            <div class="hotspot-item">
                <img src="{{ url_for('static', filename='photos/黄山.jpg') }}" alt="黄山" />
                <p>黄山</p>
            </div>
            <div class="hotspot-item">
                <img src="{{ url_for('static', filename='photos/泰山.jpg') }}" alt="泰山" />
                <p>泰山</p>
            </div>
            <div class="hotspot-item">
                <img src="{{ url_for('static', filename='photos/桂林.jpg') }}" alt="桂林" />
                <p>桂林</p>
            </div>
            <div class="hotspot-item">
                <img src="{{ url_for('static', filename='photos/三峡.jpg') }}" alt="三峡" />
                <p>三峡</p>
            </div>
            <div class="hotspot-item">
                <img src="{{ url_for('static', filename='photos/布达拉宫.jpg') }}" alt="布达拉宫" />
                <p>布达拉宫</p>
            </div>
        </div>
    </div>

    <!-- 广告栏 -->
    <div class="ad-space">
        <img src="{{ url_for('static', filename='photos/广告位.jpg') }}" alt="广告位" />
    </div>

   <!-- 底部导航栏 -->
<div class="navbar">
    <a href="{{ url_for('home') }}" class="nav-item">
        <img src="{{ url_for('static', filename='photos/首页1.png') }}" alt="首页" />
        <p>首页</p>
    </a>
    <a href="{{ url_for('order') }}" class="nav-item">
        <img src="{{ url_for('static', filename='photos/订单2.png') }}" alt="订单" />
        <p>订单</p>
    </a>
    <a href="{{ url_for('my') }}" class="nav-item">
        <img src="{{ url_for('static', filename='photos/我的2.png') }}" alt="我的" />
        <p>我的</p>
    </a>
</div>
